<template>
  <div>
    <!-- 添加体温记录 -->
    <el-dialog
      v-model="dialogVisible"
      :title="ruleForm.id ? '修改体温记录' : '添加体温记录'"
      width="500"
      :before-close="handleClose"
    >
      <span>
        <!-- 表单 -->
        <el-form
          ref="ruleFormRef"
          :model="ruleForm"
          :rules="rules"
          label-width="auto"
          class="demo-ruleForm"
          status-icon
        >
          <el-form-item label="老人：" prop="elderlyId">
            <el-button @click="select">{{ selectName ? selectName : "选择老人" }}</el-button>
          </el-form-item>
          <el-form-item label="体温：" prop="val">
            <el-input v-model="ruleForm.val" placeholder="请输入体温" clearable />
          </el-form-item>
        </el-form>
      </span>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="handleClose">取消</el-button>
          <el-button type="primary" @click="submit(ruleFormRef)">确定</el-button>
        </div>
      </template>
    </el-dialog>
    <selectElderly v-if="selectDialogVisible" @close="closeHandle" />
  </div>
</template>

<script setup lang="ts">
import { ref, defineEmits, defineProps, onMounted, reactive } from "vue";
import { ElMessage, ElMessageBox, FormInstance, FormRules } from "element-plus";
import { AddParams } from "@/api/medicalcare/temperature/type";
import selectElderly from "@/components/market/discharge/selectElderly.vue";
import {
  addTemperature,
  updateTemperature,
  getTemperatureModel,
} from "@/api/medicalcare/temperature/temperature";

const emit = defineEmits(["close"]);
const props = defineProps({
  updateId: Number,
});

const ruleFormRef = ref<FormInstance>();
const ruleForm = reactive<AddParams>({
  elderlyId: 0,
  staffId: 0,
  val: "",
});

const dialogVisible = ref(true);
//选择老人dialog
const selectDialogVisible = ref(false);

//选择老人
const select = () => {
  selectDialogVisible.value = true;
};

//规则
const rules = reactive<FormRules<AddParams>>({
  val: [{ required: true, message: "请输入血糖", trigger: "blur" }],
  elderlyId: [
    {
      required: true,
      message: "请选择老人",
      trigger: "change",
    },
  ],
});

//选择老人姓名
let selectName = ref("");

//关闭dialog
const closeHandle = (data: any) => {
  selectDialogVisible.value = false;
  if (data) {
    ruleForm.elderlyId = data.id;
    selectName.value = data.name;
  }
};

//确定
const submit = async (formEl: FormInstance | undefined) => {
  if (!formEl) return;
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      if (ruleForm.id) {
        //修改
        await updateTemperature(ruleForm);
        ElMessage({
          message: "修改成功",
          type: "success",
        });
      } else {
        //添加
        await addTemperature(ruleForm);
        ElMessage({
          message: "添加成功",
          type: "success",
        });
      }
      emit("close", true);
    } else {
      console.log("error submit!", fields);
    }
  });
};
//关闭
const handleClose = () => {
  emit("close");
};

//获取详情
const getDetail = async (id: number) => {
  let res = await getTemperatureModel(id);
  // console.log("777res", res);
  Object.assign(ruleForm, res);
  selectName.value = res.elderlyName;
};

onMounted(() => {
  if (props.updateId) {
    getDetail(props.updateId);
  }
});
</script>

<style scoped></style>
